<%@page language="java" pageEncoding="utf-8"%>
<%@page import="inet.util.DateProc"%>
<%@page import="java.util.Vector"%>
<%@page import="java.math.BigDecimal"%>
<%@page import="inet.util.StringTool"%>
<%@page import="lib.db.clip.ClipCategory"%>
<%@page import="java.util.Iterator"%>
<%@page import="lib.db.clip.Clip"%>
<jsp:useBean id="clipDAO" class="lib.db.clip.ClipDAO" scope="session"/>
<jsp:useBean id="categoryDAO" class="lib.db.clip.ClipCategoryDAO" scope="session"/>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>Danh sách clip</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
  	<link rel="icon" href="<%=request.getContextPath() %>/favicon.ico" type="image/x-icon" />
    <link href="../include/default.css" type="text/css" rel="stylesheet" />
	<script src="../include/default.js" type="text/javascript"></script>
	<link href="../include/gallery.css" rel="stylesheet" type="text/css" />
	<link rel="stylesheet" type="text/css" href="<%=request.getContextPath() %>/include/ui-lightness/jquery-ui-1.7.2.custom.css" />
	<script type="text/javascript" src="<%=request.getContextPath() %>/include/jquery-1.3.2.min.js"></script>
	<script type="text/javascript" src="<%=request.getContextPath() %>/include/jquery-ui-1.7.2.custom.min.js"></script>
    <script type="text/javascript">
	  	function markAll(){
			var chkAll = document.frm_show.checkAllBox.checked;
			var field = document.frm_show.check_value;
			if(chkAll == true){
				for (i = 0; i < field.length; i++)
					field[i].checked = true ;
				field.checked = true;
			}else{
				for (i = 0; i < field.length; i++)
					field[i].checked = false ;
				field.checked = false;
			}
		}
	    function xoaAll(){
			var field = document.frm_show.check_value;
			var hasRow = false;
			for (i = 0; i < field.length; i++){
				if(field[i].checked == true)
					hasRow = true;
			}
			if(!hasRow && document.frm_show.check_value.checked){
				hasRow = true;
			}
			if(hasRow == false){
				alert('Chọn cột cần xóa');
				return false;
			}
			if(confirm('Bạn có chắc chắn xóa không?')){
				document.frm_show.action.value = 'DELETE_ALL';
				document.frm_show.submit();
			}
		}
		function showDialog(link){
			var html = ''+ link;
			$('#dialog-modal').dialog('open');
			$("#dialog-modal").dialog({
				width: 520,
				height: 150,
				modal: true,
			});    
			$('#dialog-modal').dialog('option', 'title', 'Nhúng link ảnh vào bài viết hoặc trang web');
			$('#dialog-modal').html('<textarea id="link_img" style="height: 50px; width: 480;" onclick="SelectAll(\'link_img\');">' + html + '</textarea>');
		}
		
		function showDialog1(link){
			var html = ''+ link;
			$('#dialog-modal1').dialog('open');
			$("#dialog-modal1").dialog({
				width: 720,
				height: 500,
				modal: true,
			});    
			$('#dialog-modal1').dialog('option', 'title', 'Preview ảnh');
			$('#dialog-modal1').html('<img style="height: 400px; width: 680px;" src="'+html+'" />');
		}
		function SelectAll(id)
		{
		    document.getElementById(id).focus();
		    document.getElementById(id).select();
		}
		function deleteClip(id) {
			frm_show.id.value = id;
			frm_show.action.value = 'delete_clip';
			frm_show.submit();
		}
  	</script>
  	<style type="text/css">
  		.responderButton{
  			background-color: #5F4C0B; color: #fff; border: 1px solid #fff; 
  			border-radius: 5px; cursor: pointer; height: 25px;
  		}
  		input.album-button {
		    border: 1px solid #356acb;
		    border-radius: 2px 2px 2px 2px;
		    color: #fff;
		    cursor: pointer;
		    font-size: 11px;
		    font-weight: bold;
		    height: 27px;
		    line-height: 26px;
		    margin: 0;
		    padding: 0 10px;
		    position: relative;
		    text-align: center;
		    vertical-align: middle;
		}
  		input.album-button {
		    /*-moz-box-align: stretch;
		    -moz-box-sizing: content-box;
		    -moz-user-select: none;
		    */
		    background: -moz-linear-gradient(center top , #006699, #006699) repeat scroll 0 0 transparent;
		    
		    background-image: -webkit-gradient(
				linear,
				left bottom,
				left top,
				color-stop(0.13, #356acb),
				color-stop(0.68, #356acb)
			);
		    transition: all 0.2s ease 0s;
		}
  	</style>
  </head>
  <body marginheight="0" topmargin="0" marginwidth="0" leftmargin="0" rightmargin="0">
  	<%@ include file="../include/checklogin.jsp" %>
  	<%
  		request.setCharacterEncoding("utf-8");
  		String sAction = request.getParameter("action");
  		String msg = "";
  		if("delete_clip".equals(sAction)) {
			String sId = request.getParameter("id");
			BigDecimal id = BigDecimal.ZERO;
			if(sId != null && StringTool.isNumberic(sId)) {
				id = new BigDecimal(sId);
			}
			if(clipDAO.deleteRow(id) ){
				msg = "<span style='color:blue'>Xóa clip thành công</span>";
			} else {
				msg = "<span style='color:red'>Xóa clip KHÔNG thành công</span>";
			}
		} else if ("delete_all".equalsIgnoreCase(sAction)) {
			String[] variable = request.getParameterValues("check_value");
    		if(variable != null && variable.length > 0){
				for(int i = 0; i < variable.length;i++){
					//Kiểm tra landing_page_post có form_id = variable[i]
					//Danh sách người dùng đã đăng ký ? post_id --> form_id 
					if(clipDAO.deleteRow(new BigDecimal(variable[i]))){
						msg = "<span style='color:blue'>Xóa clip thành công</span>";
					}else{
						msg = "<span style='color:red'>Xóa clip KHÔNG thành công</span>";
					}
				}
			}
		}
		Vector vCate = categoryDAO.findAll(1, 50);
  	%>
  	<div class="list" style="margin-left: 16.5%; height: 30px; padding-top: 10px; font-size: 15px;">
  		<a href="<%=request.getContextPath() %>/">Home page</a> &raquo;
  		List clip
  	</div>
    <center>
  	<p align="center">
		<b><font color="#000080" face="Tahoma" size="4">
			QUẢN LÝ CLIP
		</font></b>
  	</p>
	<div align="center"><%=msg %></div>
	<form name="frm_show" method="post">
		<input type="hidden" name="action" />
		<input type="hidden" name="id" />
		
		<table width="66%" cellpadding="0" cellspacing="0" border="0">
  			<tr>
  				<td colspan="9" align="right">
  					<span class="GEE3RVNDMU">
						<input type="button" value="Tải clip lên" class="blogg-button GEE3RVNDNU" onclick="window.location.href='clip_add.jsp'"/>
					</span>
  				</td>
  			</tr>
  		</table>
  		<br/>
  	<% 
  		String sPage = request.getParameter("page");
    	String sCateId = request.getParameter("cateId");
    	BigDecimal cateId = BigDecimal.ZERO;
    	if(sCateId == null) sCateId = "-1";
    	if(sCateId != null && StringTool.isNumberic(sCateId)) {
    		cateId = new BigDecimal(sCateId);
    	}
    	
  	%>
  		<table width="66%" cellpadding="0" cellspacing="0" border="0" height="30px">
	  		<tr bgcolor="#EEEEEE" height="30px">
	  			<td align="left" class="header">
		  			<input type="checkbox" name="checkAllBox" onClick="markAll();"/>
		  			<select name="slbAlbumId" onchange="window.top.location=frm_show.slbAlbumId.options[frm_show.slbAlbumId.selectedIndex].value;">
					  	 	<option value="index.jsp"> --- Tất cả --- </option>
					  	 <% 
					  	 	if(vCate != null && !vCate.isEmpty()) {
					  	 		ClipCategory cate = null;
					  	 		for (Iterator it = vCate.iterator(); it.hasNext(); ){
					  	 			cate = (ClipCategory) it.next();
					  	 			if(cate == null )continue;
					  	 %>
					  	 	<option <%= cateId.equals(cate.getId()) ? "selected":"" %> value="?cateId=<%= cate.getId() %>"> <%= cate.getName() %> </option>
					  	 <%
					  	 		}
					  	 	}
					  	 %>
					</select>
					<input type="button" value="Tạo danh mục" class="album-button GEE3RVNDNU" onclick="window.location.href='cate_list.jsp'"/>
		  		</td>
	  		</tr>
   <%
	    if(sPage == null){
	    	sPage="1"; 
	    }
	    int currPage=1;
	    try{
	        currPage = Integer.parseInt(sPage);
	    }catch(NumberFormatException ex){
	    	currPage = 1;
	    }
	  	int PagesOfSegment = 5;
	    int rowsPerPage = 24;
		int totalRecs = 0;
		int numOfPages = 0;
		if(cateId != BigDecimal.ZERO) {
			totalRecs = clipDAO.countByCateId(cateId);
		} else {
			totalRecs = clipDAO.countAll();
		}
		numOfPages = (totalRecs % rowsPerPage != 0)?(totalRecs / rowsPerPage + 1):(totalRecs / rowsPerPage);
		if(totalRecs <= rowsPerPage) {
			numOfPages = 1;
		}
		if(totalRecs == 0){ 
			numOfPages = 1;
		}
		if(currPage > numOfPages) {
			currPage = numOfPages;
		}
		if(currPage < 0) {
			currPage = 1;
		}
		Vector vFile = null;
		if(cateId != BigDecimal.ZERO) {
			vFile = clipDAO.findByCateId(cateId, currPage, rowsPerPage);
		} else {
			vFile = clipDAO.findAll(currPage, rowsPerPage);
		}
   %>
			<tr>
				<td align="left" class="header">
					<div class="grid_10">
				        <div class="box round first" style="background: none repeat scroll 0 0 #E0E0E0;color: #000;">
				                <div class="block">
				                <div class="gallery-sand">
				                    <!-- Big Gallery Sorting: End -->
				                    <!-- Small Gallery Content: Start -->
				                    <div class="filter-results">
				                        <ul class="gallery small">
				                        	<% 
				                        		if(vFile != null && !vFile.isEmpty()) {
				                        			Clip clip = null;
				                        			for (Iterator it = vFile.iterator(); it.hasNext(); ) {
				                        				clip = (Clip) it.next();
				                        				if(clip == null) continue;
				                        	%>
				                            <!-- Small Gallery Image: Start -->
				                            <li title="<%= clip.getName() != null ? clip.getName():"" %>">
				                                <div class="actions">
				                                    <a href="javascript:void();" title="Xóa" onclick="if(confirm('Bạn có chắc chắn xóa???')){deleteClip(<%= clip.getId() %>);}" class="delete">delete</a>
				                                    <a href="clip_edit.jsp?clipId=<%= clip.getId() %>" title="Sửa" class="edit">edit</a>
				                                    <div style="float: right;width: 8px; height: 40px;vertical-align: middle;padding-top: 40px;">
				                                    	<input type="checkbox" name="check_value" value="<%= clip.getId() %>" />
				                                    </div>
				                                </div>
				                                <a class="popup" href="javascript:void(0);">
				                                    <img src="<%= clip.getUrlImage() %>" alt="" />
				                                </a>
				                                <h5><%= clip.getName() != null ? clip.getName():"" %></h5>
				                                <span class="time_upload">
													<span class="extra" role="listitem"><%= DateProc.getDateTime24hString(clip.getGenDate()) %></span>
												</span>
				                            </li>
				                            <!-- Small Gallery Image: End -->
				                            <% 
				                            		} // end for
				                            	} else {
				                            		out.println("<li>Chưa có clip nào được upload.</li>");
				                            	}
				                            %>
				                        </ul>
				                    </div>
				                    <!-- Small Gallery Content: End -->
				                </div>
				            </div>
				        </div>
				    </div>
		  		</td>
	 		</tr>
   <%
   %>	
   		</table>
		<table cellpadding="0" cellspacing="0" border="0" width="66%" style="margin-top: 10px;">
			<tr>
				<td>
					<input type="button" class="blogg-button GEE3RVNDNU" value="Xóa" onclick="return xoaAll();"/>
					&nbsp;&nbsp;
				</td>
				<td class="list" colspan="10" align="right">
				<%
					int startNo = 0;
					int endNo = 0;
					if (numOfPages > 1) {
						//Print Previous Page if required
						out.println("Trang");
						int currSegment = currPage / PagesOfSegment;
						if (currPage % PagesOfSegment > 0)
							currSegment += 1;
						startNo = currSegment * PagesOfSegment - PagesOfSegment + 1;
						if (currSegment * PagesOfSegment > numOfPages)
							endNo = numOfPages;
						else
							endNo = currSegment * PagesOfSegment;
						if (currSegment > 1) {
							out.print("<a href='?page=1&cateId="+ sCateId +"' class='bluedark-text'> Đầu </a>");
							out.print("<a  href='?page=" + (currSegment - 1)
									* PagesOfSegment + "&cateId="+ sCateId +"' class='bluedark-text'> &lt;&lt;</a>");
						}
						//Print direct access page numbers.
						for (int No = startNo; No <= endNo; No++) {
							if (No == currPage) {
								out.print("<font color='red'><b>" + No + "</b></font>  ");
							} else {
								out.print("<a href='?page=" + No + "&cateId="+ sCateId +"' class='bluedark-text'>" + No + "</a>  ");
							}
						}
						//Print Next Page if required
						if (numOfPages != endNo)
							out.print(" ...<a href='?page=" + numOfPages
									+ "&cateId="+ sCateId +"' class='bluedark-text'> " + numOfPages + " </a>");
		
						if (numOfPages > PagesOfSegment * currSegment) {
							out.print("<a href='?page=" + ((currSegment * PagesOfSegment) + 1)
									+ "&cateId="+ sCateId +"' class='bluedark-text'>&gt;&gt;</a>");
							out.print("<a href='?page=" + numOfPages + "&cateId="+ sCateId +"' class='bluedark-text'> Cuối </a>");
						}
					}
				%>
				</td>
			</tr>
		</table>
		<div id="dialog-modal" title="Mã nhúng" style="display: none;"></div>	
		<div id="dialog-modal1" title="Mã nhúng" style="display: none;"></div>	
   	</form>
   </center>
  </body>
</html>
